<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div style="width:100px;height:100px;background-color:red;"></div>
    <script>
        // 键盘事件
        // onkeydown > onkeypress > onkeyup
        // 按键按下会连续触发，必须是这样
        document.onkeypress = function(e) {
            console.log('keypress');
            console.log(e);
            // keypress只能监听到字符类按键，也就是asc码表里有的
            // 监测字符类按键很准，区分大小写
            // keypress里面的charCode是asc码
            console.log(String.fromCharCode(e.charCode));// String构造函数上的方法
            // 把unicode码转换成字符
        } // 可以按着shift输出！@等字符



        document.onkeydown = function(e) {
            console.log('keydown'); //游戏技能一般keydown触发
            console.log(e);
            // keydown可以监听到所有键盘类的事件
            // 不能区分大小写
            //keydown里面 e.which 指的是 键盘上108个键的序号
        }




        document.onkeyup = function() {
            console.log('keyup'); //键盘弹起触发
        }


    
    </script>
</body>
</html>